﻿<UserControl x:Class="TheVerge.Phone.Controls.ArticleEntryControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:con="clr-namespace:TheVerge.Phone.Controls"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}">
    
    <Grid Background="{StaticResource PhoneBackgroundBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Image Source="{Binding LargeImageUri}" Stretch="Fill" />
        
        <Rectangle Fill="{Binding Converter={StaticResource hlConv}}" Opacity="0.7" />
        
        <controls:Pivot x:Name="thePiv" Margin="0,100,0,0" Grid.RowSpan="2" Padding="0" TitleTemplate="{StaticResource PivotTitleTemplate}" >
            <controls:Pivot.HeaderTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}" Margin="0" FontSize="72" FontWeight="Thin" Foreground="White" />
                </DataTemplate>
            </controls:Pivot.HeaderTemplate>
            <controls:PivotItem Header="article" Margin="0" Background="White">
                <phone:WebBrowser x:Name="theBrowser" Grid.Row="1" Padding="0" IsScriptEnabled="True" ScriptNotify="theBrowser_ScriptNotify"
                          Background="{StaticResource PhoneBackgroundBrush}"
                          LoadCompleted="theBrowser_LoadCompleted" 
                          NavigationFailed="theBrowser_NavigationFailed" />
            </controls:PivotItem>
            <controls:PivotItem Header="comments" Margin="0" Background="White">
                <con:CommentsControl x:Name="commentsControl" />
            </controls:PivotItem>
        </controls:Pivot>

        <con:FadeGrid x:Name="sharePane" Background="{StaticResource PhoneChromeBrush}" VerticalAlignment="Bottom" Visibility="Collapsed" Grid.Row="1">
            <Grid.Resources>
                <Style TargetType="Rectangle">
                    <Setter Property="Height" Value="48" />
                    <Setter Property="Width" Value="48" />
                    <Setter Property="Fill" Value="{StaticResource PhoneForegroundBrush}" />                    
                </Style>
                <Style TargetType="Button">
                    <Setter Property="HorizontalContentAlignment" Value="Left" />
                    <Setter Property="Padding" Value="0,2,12,2" />
                    <Setter Property="BorderThickness" Value="2" />
                    <Setter Property="toolkit:TiltEffect.IsTiltEnabled" Value="True" />
                </Style>
                <Style TargetType="TextBlock">
                    <Setter Property="VerticalAlignment" Value="Center" />
                </Style>
            </Grid.Resources>

            <StackPanel Orientation="Vertical" Margin="{StaticResource PhoneMargin}" HorizontalAlignment="Center">
                <Button Click="Copy_Click">
                    <StackPanel Orientation="Horizontal">
                        <Rectangle>
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="/Images/appbar.page.copy.png" />
                            </Rectangle.OpacityMask>
                        </Rectangle>
                        <TextBlock Text="Copy link to Clipboard"  />
                    </StackPanel>
                </Button>

                <Button Click="Email_Click">
                    <StackPanel Orientation="Horizontal">
                        <Rectangle>
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="/Images/appbar.mail.png" />
                            </Rectangle.OpacityMask>
                        </Rectangle>

                        <TextBlock Text="E-Mail" />
                    </StackPanel>
                </Button>

                <Button Click="SMS_Click">
                    <StackPanel Orientation="Horizontal">
                        <Rectangle>
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="/Images/appbar.sms.png" />
                            </Rectangle.OpacityMask>
                        </Rectangle>

                        <TextBlock Text="SMS" />
                    </StackPanel>
                </Button>

                <Button Click="Social_Click">
                    <StackPanel Orientation="Horizontal">
                        <Rectangle>
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="/Images/appbar.twitter.png" />
                            </Rectangle.OpacityMask>
                        </Rectangle>
                        <TextBlock Text="Social Network" />
                        <Rectangle>
                            <Rectangle.OpacityMask>
                                <ImageBrush ImageSource="/Images/appbar.facebook.png" />
                            </Rectangle.OpacityMask>
                        </Rectangle>
                    </StackPanel>
                </Button>
            </StackPanel>
        </con:FadeGrid>
    </Grid>
</UserControl>
